<template>
	<view class="login">
		<view class='flexLeft'>
			<view class="leftBox">
				<view class='logoBox'>
					<image src="../../static/logo.png"></image>
				</view>
				<text class="textContent">应急融合通信平台</text>
			</view>
		</view>
		<view class="flexRight">
			<view class="loginText">登录</view>
			<view class='items'>
				<view class="title">账号</view>
				<input class="uni-input" name="username"/>
			</view>
			<view class='items'>
				<view class="title">密码</view>
				<input class="uni-input" name="password"/>
			</view>
			<view>
				<button class='btn' type="primary" @click="toHome">登录</button>
			</view>
			
		</view>
	</view>
</template>

<script>
	
	export default {
		data() {
			return {
				
			}
		},
		components:{
			
		},
		onLoad() {
	
		},
		methods: {
			//主页跳转
			toHome(){
				uni.navigateTo({
					url:'../home/index'
				})
			},
		}
	}
</script>

<style lang="less" scoped>
	.login{
		display: flex;
		height: 375px;
		overflow: hidden;
		.flexLeft{
			height: 100%;
			flex: 1;
			position: relative;
			.leftBox{
				width:162px;
				height:162px;
				position: absolute;
				top:50%;
				left:50%;
				transform: translate(-50%,-50%);
				.logoBox{
					width: 100px;
					height: 100px;
					border-radius: 10px;
					box-shadow: #cedced 0px 0px 20px;
					margin: 0 auto;
					margin-bottom: 20px;
					image{
						width: 100%;
						height: 100%;
					}
				}
				.textContent{
					font-size: 20px;
				}
			}
		}
		.flexRight{
			flex: 1;
			height: 100%;
			padding: 40px 30px;
			box-sizing: border-box;
			.loginText{
				font-size: 22px;
				font-weight: 700;
				margin-bottom: 10px;
			}
			.items{
				margin: 30px 0px;
				.title{
					font-size: 16px;
					height: 20px;
					margin-bottom: 4px;
				}
				.uni-input{
					width: 365px;
					height: 45px;
					border: 1px solid #aac3e0;
					border-radius: 5px;
				}
				
			}
			.btn{
				background: #126cb7;
			}
		}
	}
</style>
